import React from 'react';
import {connect} from 'dva/index';
import {Button, Col, DatePicker, Form, Input, Popconfirm, Radio, Row, Table} from 'antd';
import Constants from '../../utils/Constants';
import RightConstants from '../../utils/RightConstants';
import BizParams from '../../components/common/BizParams';
import RoleSelect from '../../components/common/roleSelect';
import RightBox from '../../components/common/rightBox';
import OnlineBookingDetail from '../../components/logisticsOrder/onlineBookingDetail'

const { RangePicker } = DatePicker;
const RadioGroup = Radio.Group;
const R = require('ramda');
// const statusArr = ['删除', '待处理','已处理'];
const statusArr = ['删除', '草稿', '待处理', '作废审批中', '确认作废', '仲裁作废', '已处理'];
const FormItem = Form.Item;
const onlineBooking = Form.create()(class QuickBooking extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            bookingId: undefined,        //当前订舱ID
        }
    }
    componentDidMount() {
        //多个页面共用一个state的page跟list，这里面的首次查询必须带默认的page信息
        this.props.dispatch({ type: 'quickBooking/getOpenListForPage', payload: { ...R.pick(['page', 'size'], Constants.DEFAULT_PAGE) } });//查询订单列表
    }

    handleSearch = (flag) => {
        let values = this.props.form.getFieldsValue();
        // values.beginTime = R.isNil(values.bookingTime) || R.isEmpty(values.bookingTime) ? null : values.bookingTime[0].format(Constants.DATEFORMAT);
        // values.endTime = R.isNil(values.bookingTime) || R.isEmpty(values.bookingTime) ? null : values.bookingTime[1].format(Constants.DATEFORMAT);
        // values.bookingTime = undefined;
        let newPage = R.pick(['page', 'size'], this.props.quickBooking.page);
        if (flag) newPage.page = 1;
        this.props.dispatch({
            type: 'quickBooking/getOpenListForPage',
            payload: {
                ...values,
                ...newPage
            }
        });
    };

    handleOpen = (id, disabled) => {
        // this.props.dispatch({ type: 'supplier/getSupplierList', payload: { supplierType: Constants.SUPPLIER_TYPE.FRAE } });  //查询海运供应商
        // this.props.dispatch({ type: 'supplier/getAirSupplierList' });  //查询空运供应商List
        // this.props.dispatch({ type: 'berthingCompany/getAllBerthingCompanys' }); //查询船公司
        this.props.dispatch({ type: 'quickBooking/getByIdDetail', payload: { id } });
        this.onlineBookingDetail.handleOpen(disabled);
    }

    handleDelete = (id) => {
        this.props.dispatch({
            type: 'quickBooking/deleteById',
            payload: {
                id,
                onSuccess: this.handleSearch
            },

        })

    }

    columns = [
        { title: '客户名称', dataIndex: 'cstName', key: 'cstName' },
        { title: '业务员', dataIndex: 'salesName', key: 'salesName' },
        { title: '服务类型', dataIndex: 'serviceItemValue', key: 'serviceItemValue' },
        { title: '目的港', dataIndex: 'destinationName', key: 'destinationName' },
        { title: '起运港', dataIndex: 'loadingName', key: 'loadingName' },
        { title: '联系人', dataIndex: 'linkman', key: 'linkman' },
        { title: '订舱号', dataIndex: 'seqNo', key: 'seqNo' },
        { title: '订舱时间', dataIndex: 'createtime', key: 'createtime' },
        { title: '状态', key: 'status', render: (text, record, index) => { return <span>{statusArr[record.status]}</span> } },

        {
            title: '操作', key: 'key_oprator',
            render: (text, record, index) => {
                let deleteLink = <Popconfirm placement="leftTop" onConfirm={this.handleDelete.bind(this, record.id)} okText="是" cancelText="否"
                                             title={'是否确认删除'}>
                    <a href="#">删除</a>
                </Popconfirm>
                deleteLink = <RightBox resource={RightConstants.BOOKING.BOOKING_DELETE} split={true}>{deleteLink}</RightBox>
                let editLink = <a href="#" onClick={this.handleOpen.bind(this, record.id, false)}>编辑</a>
                editLink = <RightBox resource={RightConstants.BOOKING.BOOKING_EDIT} split={true}>{editLink}</RightBox>
                let viewLink = <a href="#" onClick={this.handleOpen.bind(this, record.id, true)}>查看</a>
                editLink = record.status === '1' ? editLink : null;
                deleteLink = record.status === '1' ? deleteLink : null;
                return <span>{editLink}{deleteLink}{viewLink}</span>;
            }
        }
    ];

    render() {
        // console.log(R.isNil(this.props.quickBooking.dataSource.list))
        let dataSource = R.isNil(this.props.quickBooking.dataSource) ? {} : this.props.quickBooking.dataSource;
       let formItemLayout = { labelCol: { span: 8 }, wrapperCol: { span: 16 } };
        const { getFieldDecorator } = this.props.form;
        let values = this.props.form.getFieldsValue();
        // values.beginTime = R.isNil(values.bookingTime) || R.isEmpty(values.bookingTime) ? null : values.bookingTime[0].format(Constants.DATEFORMAT);
        // values.endTime = R.isNil(values.bookingTime) || R.isEmpty(values.bookingTime) ? null : values.bookingTime[1].format(Constants.DATEFORMAT);
        // values.bookingTime = undefined;
        let pagination = {
            showTotal: total => `共 ${total} 条数据`,
            current: this.props.quickBooking.page.page,
            pageSize: this.props.quickBooking.page.size,
            total: this.props.quickBooking.page.totalRow,
            showSizeChanger: true,
            onShowSizeChange: (current, size) => {
                let newPage = R.pick(['page', 'size'], this.props.quickBooking.page);
                newPage.size = size;
                newPage.page = 1;
                this.props.dispatch({
                    type: 'quickBooking/getOpenListForPage',
                    payload: {
                        ...values,
                        ...newPage
                    }
                });
            },
            onChange: (pageNumber, pageSize) => {
                let newPage = R.pick(['page', 'size'], this.props.quickBooking.page);
                newPage.page = pageNumber;
                this.props.dispatch({
                    type: 'quickBooking/getOpenListForPage',
                    payload: {
                        ...values,
                        ...newPage
                    }
                });
            }
        }
        return (
            <div>
                <Row>
                    <Col span={8}><FormItem {...formItemLayout} label={'客户名称'}>{getFieldDecorator('cstName')(<Input />)}</FormItem></Col>
                    <Col span={8}><FormItem {...formItemLayout} label={'服务类型'}>{getFieldDecorator('serviceItems')(<BizParams sprCode="bookingType" style={{ width: '100%' }} />)}</FormItem></Col>
                </Row>
                <Row>
                    <Col span={8}><FormItem {...formItemLayout} label={'业务员'}>{getFieldDecorator('salesName')(<RoleSelect role={Constants.ROLE.SALES_MAN} style={{ width: '100%' }} />)}</FormItem></Col>
                    <Col span={8}>
                        <FormItem {...formItemLayout} label={'订舱时间'}>{getFieldDecorator('createtime')(
                            <RangePicker
                                style={{ width: '100%' }}
                                showTime={{ format: 'YYYY-MM-DD' }}
                                format="YYYY-MM-DD"
                                placeholder={['开始时间', '结束时间']} />
                            )}
                        </FormItem>
                    </Col>
                    <Col span={7} style={{ float: 'right' }}>
                        <Button type="primary" icon="search" style={{ marginRight: 5 }} onClick={this.handleSearch.bind(this, true)}>查询</Button>
                    </Col>
                </Row>
                <Row>
                    <Col span={8}>
                        <FormItem {...formItemLayout} label={'状态'}>
                            {getFieldDecorator('status', {
                                initialValue: ""
                            })(
                                <RadioGroup style={{ width: 800 }} >
                                    <Radio value="">全部</Radio>
                                    <Radio value="1">草稿</Radio>
                                    <Radio value="2">待处理</Radio>
                                    <Radio value="3">作废审批中</Radio>
                                    <Radio value="4">确认作废</Radio>
                                    <Radio value="5">仲裁作废</Radio>
                                    <Radio value="6">已处理</Radio>
                                </RadioGroup>
                            )}
                        </FormItem>
                    </Col>
                </Row>

                <Table loading={this.props.loading} rowKey={record => record.id} dataSource={this.props.quickBooking.list} columns={this.columns} bordered={true} size={'middle'} pagination={pagination} />
                <OnlineBookingDetail wrappedComponentRef={(inst) => this.onlineBookingDetail = inst} refreshList={this.handleSearch} />
            </div>
        )
    }
})

function mapStateToProps(state) {
    return {
        loading: state.loading.models.quickBooking, quickBooking: state.quickBooking, onlineBooking: state.onlineBooking
    };
}

export default connect(mapStateToProps)(onlineBooking);